<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

		<title>MarketList Detailed</title>
		<link href="css/common.css" rel="stylesheet" type="text/css"/>
		<link href="css/custom.css" rel="stylesheet" type="text/css" />
		<link href="css/UI.css" rel="stylesheet" type="text/css" />
		<script type="text/javascript" src="js/jquery1.7.2.js"></script>
		
		<script type="text/javascript">
		$(document).ready(function(){
			$('#header').load('common/header.html','',function(){
				$("#header .menu li a").removeClass("current_page");
          		$("a#ml").addClass("current_page");
			});
			$('#footer').load('common/footer.html');
			$('#menuListBtn').click(function(){
				$(this).siblings('.menulist').slideToggle(100);
			});
			$(document).ready(function(){
			$('.withmore').mouseenter(function(){
				$("<div class='cover'></div>").appendTo(this);
				$(this).children('ul').show();
			});
			$('.withmore').mouseleave(function(){
				$(this).children('ul').hide();
				$(this).children('.cover').remove();
			});
		});
			
		});
		</script>
		<style type="text/css">
			.menu ul li .current_page{
				background: #FC9A24;
   				border-color: #FFFFFF;
    			border-top-left-radius: 4px;
    			border-top-right-radius: 4px;
				border-style: solid solid none;
				border-width: 1px 1px medium;
    			position: relative;
    			z-index: 11;
    			top:-2px;
    			box-shadow:0 -3px 2px #666666;
			}
		</style>
	</head>

	<body>
		<div id="header"></div>
			
		<div class="table_list">
			<div class="container">
				<div class="MarketList_light">
					
				<div class="Wish_List">
					<a class="Wish" href="#"> Wish List(2)</a>
					<a class="Shop_by_Department footline" id="menuListBtn" href="#"><span>Shop by</span><br />Department</a>
					<!-- menu -->
						<ul class="menulist">
							<li>
								<a href="#">Sublease</a>
							</li>
							<li><a href="#">Used Automobiles </a></li>
							<li class="withmore">
								<a href="#">Alternative Transportation</a>
								<ul>
									<li><a href="">Scooters</a></li>
									<li><a href="">Bicycles</a></li>
									<li><a href="">Long Boards</a></li>
									<li><a href="">Skate Boards</a></li>
								</ul>
							</li>
							<li><a href="#">Used Textbooks</a></li>
							<li><a href="#">Furniture</a></li>
							<li><a href="#">Kitchen Appliances</a></li>
							<li class="withmore"><a href="#" >School Supplies </a>
								<ul>
									<li><a href="">Scooters</a></li>
									<li><a href="">Bicycles</a></li>
									<li><a href="">Long Boards</a></li>
									<li><a href="">Skate Boards</a></li>
								</ul>
							</li>
							<li class="withmore"><a href="#">Electronics</a>
								<ul>
									<li><a href="">Scooters</a></li>
									<li><a href="">Bicycles</a></li>
									<li><a href="">Long Boards</a></li>
									<li><a href="">Skate Boards</a></li>
								</ul>
							</li>
							<li class="withmore"><a href="#">Social Interactions and Peer Networking</a>
								<ul>
									<li><a href="">Scooters</a></li>
									<li><a href="">Bicycles</a></li>
									<li><a href="">Long Boards</a></li>
									<li><a href="">Skate Boards</a></li>
								</ul>
							</li>
							<li class="withmore"><a href="#">Ticket</a>
								<ul>
									<li><a href="">Scooters</a></li>
									<li><a href="">Bicycles</a></li>
									<li><a href="">Long Boards</a></li>
									<li><a href="">Skate Boards</a></li>
								</ul>
							</li>
						</ul>	
			
				</div>
				
				<div class="MarketList_search">
					<p>Search for:</p>
					<div class="MarketList_search_box">
						<span class="search_left">
							<a href="#">ALL</a>
						</span>
						<span class="search_body">
							<input class="MarketList_search_input" />
						</span>
						<a href="" class="search_right">
							Go
						</a>
					</div>
				</div>
				

				<div class="clear_float"></div>
				</div>
			</div>
		</div>
		
		<div class="ml_Detailed pagebar_width">
			<div class="title">
				<h1>A beautiful house</h1><span>Time :2012-8-1</span>
			</div>
			<div class="body">
				<div class="left">
					<div class="parameter">
						<div class="imgbox">
							<img src="img/photos/MarketList-Detailed_img.jpg" />
							<p>Enlarge</p>
							<ul>
								<li class="selectimg"><a href="#"><img src="img/photos/ML-D_S-img1.png" /></a></li>
								<li><a href="#"><img src="img/photos/ML-D_S-img1.png" /></a></li>
								<li><a href="#"><img src="img/photos/ML-D_S-img1.png" /></a></li>
							</ul>
						</div>
						<div class="parameter_text">
							<p><span>Price </span>:<span class="red">$1200</span>/month</p>
							<p><span>Type</span>:Apartment</p>
							<p><span>Size of Unit</span>: (i.e. 4bed 4bath)</p>
							<p><span>Configuration</span>:Furnished</p>
							<p><span>Recreational</span> facilities:Basketball Court</p>
							<p><span>Service</span>: Free Pest Contro / Utilities Included</p>
							<p><span>Location</span>:Mesa, AZ</p>
							<a class="orangebtn" href="#">
										<span class="left"></span>
										<span class="repeat">
											Contact now
										</span>
										<span class="right"></span>
							</a>
						</div>
					</div>
				</div>
				<div class="right">
					<ul>
						<li>
							
						<a href="#"><img src="img/photos/MarketList-Detailed_useimg.jpg" />
							<p>lily</p>
						</a></li>
					</ul>
				</div>
			</div>
			
			<div class="Description">
				<dt>Description</dt>
				<dd>This vehicle is eligible for up to $50,000 in Vehicle Purchase Protection when your transaction is completed online through eBay.To qualify you must be the winning bidder on 
					an auction or click the Buy It Now button directly on th
				</dd>
			</div>
			<div class="list">
				<h1>Q & A</h1>
				<div class="Keep_abreast_titlelist">
							<div class="K_a_titlelist_img"></div>
							<div class="K_a_titlelist_img_right">
								<p class="color_brown font_size14"><span class="color_orange">2012-07-16  20:04:50 </span>From:<span class="color_blue"> Classroom</span></p>
								<p class="font_size14">The film is very interesting</p>
							</div>
				</div>
				<div class="K_a_titlelist_list">
						<ul>
							<li><a></a><p class="color_brown font_size12">2012-07-16 20:01:34 
								<span class="color_blue">Yu</span>.(One World one Dream)</p>
								<span class="K_a_titlelist_message">I think so.</span>
							</li>
						</ul>
				</div>
				<div class="Keep_abreast_titlelist">
							<div class="K_a_titlelist_img"></div>
							<div class="K_a_titlelist_img_right">
								<p class="color_brown font_size14"><span class="color_orange">2012-07-16  20:04:50 </span>From:<span class="color_blue"> Classroom</span></p>
								<p class="font_size14">The film is very interesting</p>
							</div>
				</div>
				<div class="K_a_titlelist_list">
						<ul>
							<li><a></a><p class="color_brown font_size12">2012-07-16 20:01:34 
								<span class="color_blue">Yu</span>.(One World one Dream)</p>
								<span class="K_a_titlelist_message">I think so.</span>
							</li>
						</ul>
				</div>
				<div class="Keep_abreast_titlelist">
							<div class="K_a_titlelist_img"></div>
							<div class="K_a_titlelist_img_right">
								<p class="color_brown font_size14"><span class="color_orange">2012-07-16  20:04:50 </span>From:<span class="color_blue"> Classroom</span></p>
								<p class="font_size14">The film is very interesting</p>
							</div>
				</div>
				<div class="K_a_titlelist_list">
						<ul>
							<li><a></a><p class="color_brown font_size12">2012-07-16 20:01:34 
								<span class="color_blue">Yu</span>.(One World one Dream)</p>
								<span class="K_a_titlelist_message">I think so.</span>
							</li>
						</ul>
				</div>
			</div>
		</div>
		<div class="clear_float"></div>
		<div class="pagebar_width">
			<div class="pagebar">
				<span class="current">1
				</span><a href="#">2</a>
				<a href="#">3</a>
				<a href="#">4</a>
				<a href="#">5</a>
				<a href="#">6</a>
				<a href="#">7</a>
				<a href="#">8</a>
				<span>....</span>
				<a href="#">20</a>
				<a href="#">&gt;Next</a>
			</div>
		</div>
		
		<div id="footer">
			
		</div>
		
	</body>
</html>
